<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>宏任务与微任务</title>
</head>
<body>
  1. 什么是宏任务和微任务
JavaScript 把异步任务又做了进一步的划分，异步任务又分为两类，分别是：

① 宏任务(macrotask):
异步 Ajax 请求、
setTimeout、setInterval、
文件操作
其它宏任务

② 微任务(microtask):
Promise.then、.catch 和 .finally
process.nextTick
其它微任务

<img src="https://upload-images.jianshu.io/upload_images/27828718-c16b4dc2175283ef.png?imageMogr2/auto-orient/strip|imageView2/2/w/869/format/webp" alt="">

2. 宏任务和微任务的执行顺序

<img src="https://upload-images.jianshu.io/upload_images/27828718-8806d69764fb5f1e.png?imageMogr2/auto-orient/strip|imageView2/2/w/1005/format/webp" alt="">
每一个宏任务执行完之后，都会检查是否存在待执行的微任务，
如果有，则执行完所有微任务之后，再继续执行下一个宏任务。


执行顺序：
1、同步任务
2、process.nextTick // 异步任务之前执行
3、微任务
4、宏任务
5、setImmediate // 一个事件循环之后执行


<script>
  setImmediate(() => {
    console.log(1)
  })
  process.nextTick(() => {
    console.log(2)
  })
  console.log(3)
  setTimeout(() => { console.log(4) }, 0)
  setTimeout(() => { console.log(5) }, 1000)
  setTimeout(() => { console.log(6) }, 0)
  console.log(7)
  // 3、7、2、4、6、1、5
</script>
</body>
</html>